<template>
	<base-popup :title="title" v-bind="$attrs" class="min-h-[80vh] bg-bg-2">
		<div class="px-3">
			<race-list :isShowLast="true" :lastRoundData="data" />
		</div>
	</base-popup>
</template>

<script setup lang="ts">
import RaceList from './race-list.vue'
import { BasePopup } from '@/components/base'
//import { RaceLast } from '@/types'
import { computed } from 'vue'
import { fmtDate } from '@/utils'

const props = defineProps({
	data: {
		type: Object, //Object as PropType<RaceLast | null>,
		default: null
	}
})

const title = computed(() => {
	if (props.data) {
		const start = fmtDate(props.data.contestRoundVO.start)
		const end = fmtDate(props.data.contestRoundVO.end)
		return `${start} - ${end}`
	}
	return ''
})
</script>
